<template>
  <div class="header">
    <mu-appbar :z-depth="zDepth" color="primary">
      <div class="title">{{title}}</div>
    </mu-appbar>
  </div>
</template>

<script>
export default {
  name: 'ComHeader',
  props: {
    title: String,
    zDepth: {
      type: Number,
      default: 1
    }
  }
}
</script>

<style lang="stylus" scoped>
  .header
    position: fixed
    left: 0
    top: 0
    right: 0
    height: 1.12rem
    .title
      text-align: center
      height: 1.12rem
</style>
